<!DOCTYPE html>
<html>
<head>
  <title>任务二：零基础HTML及CSS编码（一）</title>
  <style type="text/css">
    #container{
      width: 90%;
      height: auto;
      background: #eee;

    }

    #header{
      width: 100%;
      height: 70px;
      background: black;
    }
    .main{
      width: 98%;
      height: 750px;
      background: white;
      margin: 5px;
    }

    #link{
      float: right;
      height: 20px;
      background: white;

    }
  </style>
</head>
<body>

<div id="container">
  <div id="header">
    <div id="link">
      <a href="#">导航连接一</a>
      <a href="#">导航连接二</a>
      <a href="#">导航连接三</a>
      <a href="#">导航连接四</a>
    </div>

  </div>
  <div class="main">
    <h2>文章一级标题</h2>
    <h2>文章二级标题</h2>
    <p>文章作者：王巧玲&nbsp;&nbsp;&nbsp;发布时间：2017-12-03</p>
    <p>温润雍容的咖啡与苦涩难闻的中药原本是风马牛不相及的两个物件，可它们却偏偏同时出现在我的生活里，时光碾过的日子里，我戒不掉咖啡的苦，  亦弃不掉中药的涩。<br/>
    我想世间再不会有第二个女子像我一样，将煮熟的咖啡盛在劣质低廉的白瓷碗里，黑褐色的看上去像是一碗中药，淼淼升起的热气夹带着咖啡特有的香气，入口圆润丝滑，才使我确认这盛在劣质白瓷碗里的汤汁，不是苦涩的中药，而是有着雍容华贵典雅的咖啡。<br/>
    <a href="http://ife.baidu.com">这里有一个链接，链接到http://ife.baidu.com</a>
    爱上咖啡，或许因它华丽诱人的外表，也或许是它入口丝滑圆润的感觉，亦或许是唇角遗留的香甜，年轻时候的我独爱速溶咖啡，喝在口里，甜甜的，香香的，苦涩的味道淡淡的。我喜欢将咖啡缠绕在舌尖，体验那种圆润的丝滑，我喜欢咖啡经过喉咙时，短暂的瞬间，似一缕春风拂过，云淡风轻，惬意而温暖。<br>
    那个时候的我很年轻，也很快乐，生活里除了阳光还是阳光，那个时候的我，笑是那样的真实，那样简单，那样的单纯。
    </p>
    <img src="F:\壁纸\html_basic1.jpg" width="300" height="303">
     <p>温润雍容的咖啡与苦涩难闻的中药原本是风马牛不相及的两个物件，可它们却偏偏同时出现在我的生活里，时光碾过的日子里，我戒不掉咖啡的苦，  亦弃不掉中药的涩。<br/>
    我想世间再不会有第二个女子像我一样，将煮熟的咖啡盛在劣质低廉的白瓷碗里，黑褐色的看上去像是一碗中药，淼淼升起的热气夹带着咖啡特有的香气，入口圆润丝滑，才使我确认这盛在劣质白瓷碗里的汤汁，不是苦涩的中药，而是有着雍容华贵典雅的咖啡。<br/>
    <a href="http://ife.baidu.com">这里有一个链接，链接到http://ife.baidu.com</a>
    爱上咖啡，或许因它华丽诱人的外表，也或许是它入口丝滑圆润的感觉，亦或许是唇角遗留的香甜，年轻时候的我独爱速溶咖啡，喝在口里，甜甜的，香香的，苦涩的味道淡淡的。我喜欢将咖啡缠绕在舌尖，体验那种圆润的丝滑，我喜欢咖啡经过喉咙时，短暂的瞬间，似一缕春风拂过，云淡风轻，惬意而温暖。<br>
    那个时候的我很年轻，也很快乐，生活里除了阳光还是阳光，那个时候的我，笑是那样的真实，那样简单，那样的单纯。
    </p>


  </div>
  <div class="main"></div>
  <div class="main"></div>
  <div class="main"></div>
  <div class="main"></div>

</div>
</body>
</html>
